<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<link rel="shortcut icon" href="favicon.ico" />
		<link rel="bookmark" href="favicon.ico" />
		<link rel="stylesheet" href="css/style.css">
	</head>
	<body style="background: url(img/banner.jpg) no-repeat center top;min-width:1100px; height:866px; position:relative;">
		<div class="container">
			<div class="top-sy">
				<div class="top-con clearfix">
					<div class="top-con-nav">
						<div class="logo">
							<img src="img/logo.png" alt="">
						</div>
						<div class="nav">
							<ul>
								<li id="template1"><a  href=""><span class="nav_en"></span><span class="nav_cn"></span></a></li>
							</ul>
						</div>
					</div>
					<div class="top-con-right">
						<div class="tel">
							0535-60652189
						</div>
						<ul>
							<li><a href=""><img src="img/qq.png" alt=""></a></li>
							<li><a href=""><img src="img/wb.png" alt=""></a></li>
							<li><a href=""><img src="img/wx.png" alt=""></a></li>
							<li><a href=""><img src="img/email.png" alt=""></a></li>
						</ul>
					</div>
				</div>
			</div>
			<div class="main">
				<div class="main-con">
					<div class="gd">
						<h3>传悦观点<span>VIEWPOINT</span></h3>
						<dl>
							<dt>
								<img src="img/img1.jpg" alt="">
							</dt>
							<dd>
								<h3>传悦上线前的准备工作</h3>
								<p>08-17</p>
								<h4>创梦网络科技有限责任公司</h4>
							</dd>
						</dl>
						<img class="close" src="img/close.png" alt="">
					</div>
				</div>
			</div>
			<div class="footer">
				<div class="footer-con">
					<div class="footer-con-left">
						<p>Copyright ©2013 创梦网络科技有限责任公司 ‖ 传悦 Chnyoo.cn All Rights Reserved 京ICP备12005221号 </p>
					</div>
					<div class="footer-con-right">
						<a id="template2" href="">关于传悦</a>
					</div>
				</div>
			</div>
		</div>
	</body>
</html>
<script>
	let close = document.querySelector(".close");
	close.onclick = function() {
		this.parentNode.style.display = "none"
	}
</script>
<script>
	let template1 = document.querySelector("#template1");
	let template2 = document.querySelector("#template2");
	let body = document.querySelector("body");
	let ul = document.querySelector(".nav ul");
	let fnav = document.querySelector(".footer-con-right")
	let http = new XMLHttpRequest();
	http.open("get", "http://10.35.164.79:82/message");
	http.send();
	http.onreadystatechange = function() {
		if (http.readyState === 4) {
			let nav = JSON.parse(http.responseText);
			nav.forEach(function(item,index) {
				let newItem1 = template1.cloneNode(true);
				newItem1.id = "";
				newItem1.querySelector(".nav_cn").innerHTML = item.cn;
				newItem1.querySelector(".nav_en").innerHTML = item.en;
				newItem1.querySelector("a").href = `http://10.35.164.79/qyz/${item.link}`;
				if(index===1 || index===4){
					newItem1.querySelector("a").href = `javascript:;`;
				};
				if (item.cn !== null || item.en !== null) {	
					ul.appendChild(newItem1);
				}
				if (item.bnav !== null) {
					let newItem2 = template2.cloneNode(true);
					newItem2.id = "";
					newItem2.innerHTML = item.bnav;
					fnav.appendChild(newItem2);
				}
			})
			console.log(nav)
		}
	}
</script>
